<nc-component v-bind:data="data[index]" class="component-groupbuy" v-bind:style="{ backgroundColor : nc.backgroundColor }">

	<!-- 预览 -->
	<template slot="preview">
		<div class="preview-box" v-bind:style="{ padding: (nc.padding + 'px 0') }">

			<template v-if="nc.lazyLoad">
				<groupbuy-top-content></groupbuy-top-content>
			</template>
			
			<div class="list-wrap">
				<div class="item">
					<div class="img-wrap">
						<img src="STATIC_EXT/diyview/img/crack_figure.png" />
					</div>
					<div class="info-wrap">
						<h4 class="ns-multi-line-hiding">商品名称</h4>
						<div class="price-wrap">
							<p class="old-price">￥1200.00</p>
							<p class="new-price ns-red-color">￥998.00</p>
						</div>
					</div>
					<div class="groupbuy-icon">团购价</div>
				</div>
				
				<div class="item">
					<div class="img-wrap">
						<img src="STATIC_EXT/diyview/img/crack_figure.png" />
					</div>
					<div class="info-wrap">
						<h4 class="ns-multi-line-hiding">商品名称</h4>
						<div class="price-wrap">
							<p class="old-price">￥1200.00</p>
							<p class="new-price ns-red-color">￥998.00</p>
						</div>
					</div>
					<div class="groupbuy-icon">团购价</div>
				</div>
				
				<div class="item">
					<div class="img-wrap">
						<img src="STATIC_EXT/diyview/img/crack_figure.png" />
					</div>
					<div class="info-wrap">
						<h4 class="ns-multi-line-hiding">商品名称</h4>
						<div class="price-wrap">
							<p class="old-price">￥1200.00</p>
							<p class="new-price ns-red-color">￥998.00</p>
						</div>
					</div>
					<div class="groupbuy-icon">团购价</div>
				</div>
			</div>
		</div>
	</template>

	<!-- 编辑 -->
	<template slot="edit">
		<template v-if="nc.lazyLoad">
			<groupbuy-list></groupbuy-list>
			<groupbuy-style></groupbuy-style>
		</template>
		
		<color v-bind:data="{ field : 'backgroundColor', 'label' : '背景颜色' }"></color>
		<slide v-bind:data="{ field : 'padding', label : '上下边距' }"></slide>
		
		<h3>顶部标题设置</h3>
		<template v-if="nc.lazyLoad">
			<groupbuy-top-list></groupbuy-top-list>
		</template>
		
		<!-- 商品列表风格弹框 -->
		<div class="groupbuy-list-style">
			<div class="style-list-groupbuy layui-form">
				<div class="style-list-con-groupbuy">
					<div class="style-li-groupbuy" v-bind:class="{'selected ns-border-color': nc.style == 1}">
						<img src="{$resource_path}/groupbuy/img/style1.png" />
					</div>
				</div>
				
				<input type="hidden" name="style">
			</div>
		</div>
	</template>
	
	<!-- 资源 -->
	<template slot="resource">

		<css src="{$resource_path}/groupbuy/css/design.css"></css>
		<js src="{$resource_path}/groupbuy/js/design.js"></js>
		
	</template>
	
</nc-component>